<template>
    <div>
        <!-- 表格操作项 start  -->
        <Button v-for="(item, index) in tableBtn" :key="index" type="primary" :icon="item.icon" class="ivu-mr-8"
            @click="tableTopOperate(item.name)">{{ item.label }}</Button>
        <Dropdown class="ivu-ml-8" v-show="tableSelectData && tableSelectData.length>0" @on-click="handleClickItem">
            <Button>更多操作
                <Icon type="ios-arrow-down" />
            </Button>
            <DropdownMenu slot="list">
                <template v-for="(item, index) in tableBatchBtns">
                    <DropdownItem v-if="showBtn(item.label)" :key="index" :name="item.name">{{item.label}}
                    </DropdownItem>
                </template>
            </DropdownMenu>
        </Dropdown>
        <!-- 表格操作项 end  -->
        <Modal v-model="auditModal" title="批量审核">
            <Form ref="auditForm" :label-width="100">
                <Row>
                    <span style="margin-bottom: 10px;">
                        确定要批量审核这些品牌吗？
                    </span>
                </Row>
                <Input v-model="reason" maxlength="100" show-word-limit
                        type="textarea" placeholder="请输入原因"/>
            </Form>
            <div slot="footer">
                <Button type="primary" :loading="aloading" @click.stop="handleAgree('auditForm')">
                    <span v-if="!aloading">审核通过</span>
                    <span v-else>Loading...</span>
                </Button>
                <Button type="default" :loading="cloading" @click.stop="handleCancel('auditForm')">
                    <span v-if="!cloading">审核不通过</span>
                    <span v-else>Loading...</span>
                </Button>
            </div>
        </Modal>
    </div>
</template>
<script>
    import dynamictablebtns from '@/mixins/dynamictablebtns'; // 混入通用代码
    import { ApiRequest } from '@api/basePage';
    import { mapGetters } from 'vuex';
    export default {
        mixins: [
            dynamictablebtns
        ],
        data() {
            return {
                auditModal: false,
                aloading: false,
                cloading: false,
                reason:'',
            }
        },
        computed: {
            ...mapGetters('permissions/systemBtns', [
                'showBtn'
            ]),
        },
        methods: {
            tableTopOperate(name){
                if(name==='uploadfile'){

                }else{
                    //this.$router.push({ path: '/basics/brandsManage/brandAudit/brandAuditAdd', query: {} })
                }
            },
             // 获得选中项的uuid集合
             getUuids() {
                let uuidArr = []
                this.tableSelectData.forEach(item => {
                    uuidArr.push(item.uuid)
                });
                return uuidArr.join(',');
            },
            // 审核通过
            handleAgree(name) {
                this.aloading = true;
                let data = {
                    uuids: this.getUuids(),
                }
                // 开始请求商品列表
                ApiRequest(this.requestApi.auditPass.url+'?uuids='+this.getUuids()+'&auditNote='+this.reason,
                    this.requestApi.auditPass.type, data).then(res => {
                        this.aloading = false;
                        this.$Message.success('批量审核成功');
                        this.auditModal = false;
                        this.tableSelectData = [];
                        this.actionsChange();
                    }).catch((err) => {
                        this.aloading = false;
					});
            },
            // 拒绝审核
            handleCancel(name) {
                if(this.reason===''){
                    this.$Message.info('审核原因不能为空!');
                    return;
                }
                this.aloading = true;
                let data = {
                    uuids: this.getUuids(),
                }
                // 开始请求商品列表
                ApiRequest(this.requestApi.auditNoPass.url+'?uuids='+this.getUuids()+'&auditNote='+this.reason,
                    this.requestApi.auditNoPass.type, data).then(res => {
                        this.aloading = false;
                        this.$Message.success('批量拒绝成功');
                        this.auditModal = false;
                        this.tableSelectData = [];
                        this.actionsChange();
                    }).catch((err) => {
                        this.aloading = false;
					});
            },
            handleClickItem(name) {
                if (name === 'delete') {
                    let uuidArr = []
                    this.tableSelectData.forEach(item => {
                        uuidArr.push(item.uuid)
                    });
                    this.$Modal.confirm({
                        title: '批量删除',
                        content: '确定要批量删除这些品牌吗？',
                        onOk: () => {
                            let data = {
                                uuids: uuidArr.join(',')
                            }
                            // 开始请求列表
                            ApiRequest(this.requestApi.delTableList.url, this.requestApi.delTableList.type, data, true).then(res => {
                                if (res.retStatus === '1') {
                                    this.$Message.success('批量删除成功');
                                    this.tableSelectData = [];
                                    this.actionsChange();
                                }
                            })
                        }
                    })
                } else if (name === 'audit') {
                    this.auditModal = true;
                }
            }
        }
    }
</script>
